$(function(){
    let form = layui.form;
    let laypage = layui.laypage;

    // 表单验证
    form.verify({
      changdu: [/^\S{6,12}$/, '密码长度必须是6~12且不能有空格'],
      same: function (value) {
          var uname = $('.layui-form input[name=password]').val()
          if (value !== uname) {
            return '两次输入的密码不一样'
          }
        }
  })     

  // 默认页码数
  var pagenum = 1
  // 每页显示条数
  var pagesize = 3


  // 1. 加载用户数据
  function list(param){
      console.log(param);
      $.ajax({
          type:'get',
          url:'/admin/users',
          data: param,
          success: function (res) {
              layer.msg(res.message)
              // 把数据渲染到页面上
              var tags = template('table-tpl', res)
              $('.layui-table tbody').html(tags)
              

              // 初始化分页器
              laypage.render({
                // 注意，这里的 articlePage 是 ID，不用加 # 号
                elem: 'articlePage',
                // 当前页码
                curr: pagenum,
                // 数据总数，从服务端得到
                count: res.total,
                // 每页显示的条数
                limit: pagesize,
                // 每页显示条数列表
                limits: [3, 10, 30, 40, 100],
                // 分页条布局效果
                layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
                // 页面切换是触发的动作
                jump: function (obj, first) {
                  // obj 表示分页的所有参数；first用于判断首次加载
                  // 这里触发时，需要修改当前页码
                  pagenum = obj.curr
                  // 切换每页显示条数时，修改pagesize
                  pagesize = obj.limit
                  // 重新加载接口数据
                  if (!first) {
                    // 首次不触发，切换页码时触发
                    list({
                      pagenum,
                      pagesize
                    })
                  }
                }
              });
          }
      })
  }
  list({
      pagenum,
      pagesize
  })

  // 2.删除用户数据
  $('.layui-table tbody').on('click','.layui-btn-danger', function(e) {
    let id = $(e.target).data('id')
    // 询问用户是否确定删除
    layer.confirm('您确认要删除吗？？？',function (index) {
      // 发送请求
      $.ajax({
        type:'delete',
        url:'/admin/users/' + id,
        success: function(res) {
          layer.msg(res.message)
          // 重新请求数据
            list({
              pagenum:1,
              pagesize:3
          })
        }
      })
    })
  })

  // 3.重置密码，弹出层
  $('.layui-table tbody').on('click','.layui-btn-normal', function(e) {
    let id = $(e.target).data('id')
    let index = layer.open({
      type:1,
      title:'重置密码',
      content:$('#repwd-form-tpl').html(),
      area:['500px','250px']
    })
    // 发送请求
    $('#repwd-form').submit(function(e){
      e.preventDefault()
      $.ajax({
        type:'put',
        url:'/admin/users/' + id,
        data:{
          password:$('#repwd-form input[name=password]').val()
        },
        success: function (res) {
          layer.msg(res.message)
          layer.close(index)
        }
      })
    })
  })

})
